<template>
  <div class="c1">
    <div class="logo" />
    <div :class="$style.mTest">hello word, {{ busState.d }}</div>
    <button @click="onChangeOtherState">改变额外的状态</button>
  </div>
</template>

<script>

import busState from './bus-state'

export default {
  created () {
    this.busState = busState
  },
  methods: {
    onChangeOtherState () {
      busState.d = busState.d === 'bar' ? 'foo' : 'bar'
    }
  }
}
</script>

<style module>
.mTest {
  color: rgb(46, 146, 0);
}
</style>

<style scoped>
.logo {
  background: url('@/assets/logo.png')
}
.c1 {
  color: blue;
}
</style>
